<div>

<div id="middle-content" class="tmargin">
	<div class="left">
		<?php require_once (dirname(dirname(__FILE__)).'/filter.php');?>
	</div>
	<div class="recently-viewed rounded-corners light-brown-border create-account left">
		<div class="head cartHead">
			<h4><?=lang('create_user')?></h4>
		</div>
		<div class="clear"></div>
		<div class="create-login left" >
			<h2 class="creat"><?=lang('registred_customers')?></h2>	
				<div class="ui-widget hide" id="loginFrmValidation_checkout">
					<div class="ui-state-error ui-corner-all" > 
						<p><span class="ui-icon ui-icon-alert"></span> 
						<span class="message_checkout"></span>
						</p>
					</div>
				</div>
				<p><?=lang('create_an_account_login_text')?></p>
				<form id="loginFrm_checkout" style="width: 280px" class="new-form new-form-create" name="login_checkout" method="post" action="<?php echo site_url('user/auth')?>">
					<input type="text" name="emailLogin" id="email_login_checkout" value="<?php echo lang('email') ?>" class="default-value left" autocomplete="off" />
					<span class="left" style="color: rgb(255, 0, 0); height: 30px; line-height: 43px;">*</span>
					<div class="clear"></div>
					<input id="password_login_creat-clear"  class="hide left" type="text" value="<?php echo lang('password') ?>" autocomplete="off" />
					<input id="password_login_creat" class="left" type="password" name="passwordLogin" value="" autocomplete="off" />
					<span class="left" style="color: rgb(255, 0, 0); height: 30px; line-height: 43px;">*</span>
					<div class="clear"></div>
					
					
					<span style="color: rgb(255, 0, 0); height: 30px; line-height: 43px;" class="right">* <?=lang('required_filds_lang')?></span>
					<a href="<?php echo site_url('user/forgotPassword')?>"><span style="height: 30px; line-height: 43px; color:#7c6c4e" class="left"><?=lang('forgot_pasword_lang')?></span></a>
					<div class="clear"></div>
					
					<a href="JavaScript:loginCheckout()" class="right padding10 ">
						<div class="cart_btn_left"></div>
						<div class="cart_btn_midle" style="width: 100px"><?php echo lang('login') ?></div>
						<div class="cart_btn_right"></div>
					 </a>
				</form>
		</div>
		
		
		<div class="create-create left">
			<h2 class="creat"><?=lang('new_customers')?></h2>
			<p><?=lang('new_customers_text')?></p>
			<h2 class="creat"><?=lang('create_an_account')?></h2>
			<p><?=lang('create_an_account_text')?></p>
			<?php print form_open('user/create/',array('id'=>'registerFrm' ,'class' => 'new-form new-form-create'));?>
				<h1></h1>
				<div class="formErrors">
					<?php echo validation_errors(); ?>
				</div>
				<font color="#7c6c4e"><?=lang('personal_information')?></font>
		        <ul class="form-list">
		        	<li>
		        		<div class="fields">
		        			<input id="first_name" name="first_name" class="input-field default-value left" autocomplete="off" value="<?=(set_value('first_name'))? set_value('first_name') :lang('first_name')?>" />
							<span class="left" style="color: rgb(255, 0, 0); height: 30px; line-height: 43px;">*</span>
							<div class="clear"></div>
		        		</div>
		        		<div class="fields">
		        			<input id="last_name" name="last_name" class="input-field default-value left" autocomplete="off" value="<?= (set_value('last_name'))? set_value('last_name') : lang('last_name') ?>" />
							<span class="left" style="color: rgb(255, 0, 0); height: 30px; line-height: 43px;">*</span>
							<div class="clear"></div>
		        		</div>        		
		        	</li>
		        	<li>
		        		<input id="email" name="email" class="input-field default-value left" autocomplete="off" value="<?= (set_value('email')) ? set_value('email') : lang('email')?>" />   
						<span class="left" style="color: rgb(255, 0, 0); height: 30px; line-height: 43px;">*</span>
						<div class="clear"></div>
		        	</li>
		        </ul>
				<font color="#7c6c4e"><?=lang('login_information')?></font>
		        <ul class="form-list">
		        	<li>
		        		<div class="fields">
		        			<input id="password-clear"  class="hide left" type="text" value="<?php echo lang('password') ?>" autocomplete="off" />
		        			<input type="password" id="password" class="left" name="password" autocomplete="off" class="input-field" value="" autocomplete="off"/>
							<span class="left" style="color: rgb(255, 0, 0); height: 30px; line-height: 43px;">*</span>
							<div class="clear"></div>
		        			
		        		</div>
		        		<div class="fields">
		        			<input id="repassword-clear"  class="hide left" type="text" value="<?php echo lang('repassword') ?>" autocomplete="off" />
		        			<input type="password" id="repassword"  class="left" name="repassword" autocomplete="off" class="input-field" value="" autocomplete="off"/>
							<span class="left" style="color: rgb(255, 0, 0); height: 30px; line-height: 43px;">*</span>
							<div class="clear"></div>
		        			
		        		</div>        		
		        	</li>
		        </ul>
				<div class="clear"></div>
				
				<span style="color: rgb(255, 0, 0); height: 30px; line-height: 43px;" class="right">* <?=lang('required_filds_lang')?></span>
				<input class="left" type="checkbox" style="width: 10px; height: 38px;"/>
				<span style="height: 30px; line-height: 43px; color:#7c6c4e" class="left"><?=lang('newsletter_txt')?></span>
				<div class="clear"></div>
				
				<a href="JavaScript:void(0)"  id="btn-send" class="right padding10 ">
                   	<div class="cart_btn_left"></div>
					<div class="cart_btn_midle" style="width: 100px"><?php echo lang('register') ?></div>
					<div class="cart_btn_right"></div>
	             </a>
		         <?php print form_close()?>
			<div class="clear"></div>
		</div>
	</div>	
</div>
</div>
<div class="clear"></div>

<script>
$(document).ready(function() {
	 
	$('#password_login_creat-clear').show();
	$('#password_login_creat').hide();

	$('#password_login_creat-clear').focus(function() {
	    $('#password_login_creat-clear').hide();
	    $('#password_login_creat').show();
	    $('#password_login_creat').focus();
	});
	$('#password_login_creat').blur(function() {
	    if($('#password_login_creat').val() == '') {
	        $('#password_login_creat-clear').show();
	        $('#password_login_creat').hide();
	    }
	});
	
	$('#password-clear').show();
	$('#password').hide();

	$('#password-clear').focus(function() {
	    $('#password-clear').hide();
	    $('#password').show();
	    $('#password').focus();
	});
	$('#password').blur(function() {
	    if($('#password').val() == '') {
	        $('#password-clear').show();
	        $('#password').hide();
	    }
	});
	
	$('#repassword-clear').show();
	$('#repassword').hide();

	$('#repassword-clear').focus(function() {
	    $('#repassword-clear').hide();
	    $('#repassword').show();
	    $('#repassword').focus();
	});
	$('#repassword').blur(function() {
	    if($('#repassword').val() == '') {
	        $('#repassword-clear').show();
	        $('#repassword').hide();
	    }
	});
 
	$('.default-value').each(function() {
		var default_value = this.value;
		$(this).focus(function() {
			if(this.value == default_value) {
				this.value = '';
			}
		});
		$(this).blur(function() {
			if(this.value == '') {
				this.value = default_value;
			}
		});
	});
 
});
function loginCheckout() {
	$('#loginFrmValidation_checkout').hide();
	if ($("#loginFrm_checkout").valid()){	
	$.ajax({
		url: settings.base_url + lang.lang_key + '/user/auth/',
		dataType: 'json',
		type: 'POST',
		data: {'email' : $('#email_login_checkout').val(), 'password' : $('#password_login_creat').val()},
		success: function(data){
			if (!data.status) {
				$('#loginFrmValidation_checkout .message_checkout').html(data.message);
				$('#loginFrmValidation_checkout').show();
				return false;
			}
			
			window.location = settings.base_url;
		},
		complete: function() {
		}
	});	
	}									
}

</script>